import React, { useRef, FC } from 'react'
import { withRouter } from 'react-router-dom'
import MyTable from '@/components/common/table'
import JdApi from '@/api/jd'
import {Button,Input,DatePicker} from 'antd';
import MySelect from '@/components/common/mySelect'
// import { getQuery } from '@/assets/js/publicFunc'
import { useHistory } from 'react-router-dom'
const { RangePicker } = DatePicker;
const RoleList: FC = () => {
  // const query = getQuery()
  // const { type } = query

  const tableRef: RefType = useRef()
  const history = useHistory()

  const columns = [
    {
      title: '序号',
      align: 'center',
      dataIndex: 'index',
      render:(text,record,index)=>{
        return index+1
      }
    },
    {
      title: '文件名',
      dataIndex: 'fileName',
    },
    {
      title: 'Sheet模板名',
      dataIndex: 'sheetName',
    },
    
    {
      title: '行列',
      dataIndex: 'icon',
      render:(text,record,index)=>{
        return <>
          {
            rowKeys[record['rowIdx']]
          }
          {
            record['colIdx']
          }
        </>
      }
    }, 
    {
      title: '内容',
      dataIndex: 'dataContent',
    },
    {
      title: '更新时间',
      align: 'center',
      dataIndex: 'importTime',
    },
  ]
  // 新增按钮
  const AddBtn = () => (
    <Button className="fr" onClick={add} type="primary">
      导入数据
    </Button>
  )
 
  // 添加
  const add = () => { 
    history.push(history.location.pathname+'/add')
  }
  // 详情
  const detail = () => {
    history.push(history.location.pathname+'/detail?id=666')
  }

  // 搜索栏配置项
  const searchConfigList = [
    {
      key: 'fileName',
      slot: <Input placeholder="请输入文件名" allowClear />,
      rules: [],
      initialValue: ''
    },
    {
      key: 'sheetName',
      slot: <Input placeholder="请输入sheet名称" allowClear />,
      rules: [],
      initialValue: ''
    },
    {
      key: 'content',
      slot: <Input placeholder="请输入关键字" allowClear />,
      rules: [],
      initialValue: ''
    }
  ]
  return (
    <> 
      <MyTable
        apiFun={JdApi.getDataQuery}
        columns={columns}
        ref={tableRef}
       
        searchConfigList={searchConfigList}
        extraProps={{ results: 10 }}
      />
    </>
  )
}


const alphabet = ['','A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z']
const alphabet1 = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z']
const rowKeys = [];
alphabet.map((e)=>{
  alphabet1.map((k)=>{
    rowKeys.push(e+k);
  })
})
export default withRouter(RoleList)
